<!DOCTYPE html>
<script src="../fast/dom/shadow/resources/shadow-dom.js"></script>
<div id="sandbox"></div>
<script>
var shadowStyle = document.createElement('style');
shadowStyle.innerHTML = 'slot::slotted([data-color=red]) { color: red; }';

var sandbox = document.getElementById('sandbox');
sandbox.appendChild(
    createDOM('div', {},
              attachShadow(
                  {'mode': 'open'},
                  shadowStyle,
                  createDOM('slot')),
              createDOM('div', {},
                        document.createTextNode('normal')),
              // If the style is falsely shared with the <div> above, this won't turn red.
              createDOM('div', {'data-color': 'red'},
                        document.createTextNode('red'))));
</script>
